﻿@import "Library.less";

.productlist {
    .thumbnail {
        border-color: @color-border;
        border-radius: 0;
        box-shadow: none;
        padding: 1px;

        > a {
            display: block;
            text-align: center;
            height: 225px;
            line-height: 225px;

            img {
                display: inline-block;
                vertical-align: middle;
                max-width: 100%;
                max-height: 100%;
            }
        }


        h4 {
            overflow: hidden;
            white-space: nowrap;
            text-overflow: ellipsis;
        }

        .caption p {
            height: 36px;
            text-overflow: ellipsis;
            overflow: hidden;

            &::after {
                content: "...";
            }
        }
    }

    .pagination {
        margin: @margin-base 0;
    }

    .price {
        strong {
            color: @color-danger;
        }
    }

    .media {
        .media-left,
        .media-right {
            width: 230px;
            max-width: 230px;
        }
    }

    .media-body {
        width: auto;
    }

    &.bordered {
        background: #fff;
        padding: 30px;
        border: 1px solid @color-border;
        border-radius: 3px;

        .media {
            margin-bottom: 25px;
            padding-bottom: 20px;
            border-bottom: 1px solid @color-gallery;

            &:last-child {
                margin-bottom: 0;
                padding-bottom: 0;
                border-bottom: none;
            }

            .media-left {
                width: 200px;
                max-width: 200px;
                padding-right: 20px;
            }
        }
    }
}

.panel-body > .product-category {
    margin: -15px;
}

.product-category {
    &.B {
        border: 1px solid @color-gallery;
        background: @color-faint;

        a {
            float: left;
            padding: 15px;
            display: block;
            color: @color-night;

            &.active {
                background: #fff;
            }
        }
    }
}

@media all and (max-width:@screen-xs) {
    .productlist {
        .thumbnail {
            > a {
                height: 160px;
                line-height: 160px;
            }
        }

        &.bordered {
            .media {
                .media-left {
                    display: block;
                    width: 100%;
                    max-width: none;
                    padding-right: 0;
                    margin-bottom: @margin-base;
                }
            }

            .media-body {
                width: auto;
            }
        }
    }
}
